*{
    margin:0;
    padding:0
}
div#test{
    position:relative;
    width:1000px;
    height:600px;
    left:12%;
    top:25px;
    overflow: hidden;
    z-index: 10;
}
div>span{
    position:absolute;
    white-space: nowrap;
    width:200px;
    height:20px;
    left:100%;
    animation: 10s test;
    animation-timing-function: linear;
    color:rgb(36, 38, 41);
    z-index: 999;
}
@keyframes test {
    0%{
        /* transform: translateX(100%); */
        left:100%;
    }
    100%{
        /* transform: translateX(0%); */
        left:0%
    }
}
div input{
    position:absolute;
    bottom: 30px;
}
.box{
    background-color: black;
    width: 1000px;
    height:506.25px;
    z-index: 10;
}
p.box>video{
    position:absolute;
    height:506.25px;
    left:50px
}
ul li{
    list-style-type: none;
    position: absolute;
    top:3px;
}
ul{
    position:relative
}
.ul{
    width:100%;
    height:30px;
    background-color: rgba(255, 192, 203,0.6);
}
a{
    text-decoration: none;
}
.box1{
    position:absolute;
    width:150px;
    height:220px;
    border: 1px solid pink;
    left:-40px;
    top:25px;
    box-shadow: 2px 2px 3px rgba(255, 188, 199,0.7);
    background-color: rgba(255, 188, 199,0.1);
    display: none;
    animation: 500ms ani;
    z-index:100;
    overflow: hidden;
}
@keyframes ani{
    0%{
        top:40px;
    }
    100%{
        top:25px;
    }
}
li#t:hover .box1{
    display: block;
}